<template>
	<view>
		<template v-if="list.length > 0">
			<block v-for="(item, index) in list" :key="index">
				<msg-list :item="item" :index="index"></msg-list>
			</block>
		</template>
		<template v-else>
			<no-thing></no-thing>
		</template>
		
		<!-- popup弹出层-->
		<uni-popup ref="popup" type="top" background-color="#fff">
			<view class="flex align-center justify-center font-md border-bottom py-2" hover-class="bg-light" @click="popupEvent('friend')">
				<text class="iconfont icon-sousuo mr-2"></text> 贴加好友
			</view>
			<view class="flex align-center justify-center font-md py-2"  hover-class="bg-light" @click="popupEvent('clear')">
				<text class="iconfont icon-shanchu mr-2"></text> 清楚列表
			</view>
		</uni-popup>
		
	</view>
</template>

<script>
	import msgList from '@/components/msg/msg-list.vue';
	import noThing from '@/components/common/no-thing.vue';
	import uniPopup from '@/components/uni-ui/uni-popup/uni-popup.vue';
	const demo = [
		{
			avater: "/static/default.jpg",
			username: '昵称1',
			update_time: '1712557923',
			data: '内容内容内容内容内容内容内容内容内容内容内容内容内容内容内',
			noread: '20'
		},
		{
			avater: "/static/default.jpg",
			username: '昵称2',
			update_time: '1712557923',
			data: '内容内容内容内容内容内容内容内容内容内容内容内容内容内容内',
			noread: '20'
		},
		{
			avater: "/static/default.jpg",
			username: '昵称3',
			update_time: '1712557923',
			data: '内容内容内容内容内容内容内容内容内容内容内容内容内容内容内',
			noread: '20'
		}
	]
	export default {
		components: {
			msgList,
			noThing,
			uniPopup
		},
		data() {
			return {
				list: []
			}
		},
		// 点击原生导航栏
		onNavigationBarButtonTap(e) {
			switch (e.index){
				case 0:  //左边
					uni.navigateTo({
						url:"../user-list/user-list"
					})
					this.$refs.popup.close()
					break;
				case 1: //右边
					this.$refs.popup.open()
					break;
			}
			
		},
		// 页面加载时赋值
		onLoad() {
			this.list = demo
		},
		// 开启监听下拉刷新
		onPullDownRefresh() {
			this.refresh()
		},
		methods: {
			// 下拉刷新
			refresh() {
				setTimeout(() => {
					this.list = demo
					// 停止下拉刷新
					uni.stopPullDownRefresh()
				}, 2000)
			},
			// popup事件
			popupEvent(e) {
				if (e === 'friend') {
					console.log('贴加好友')
				} else {
					console.log("清楚列表")
				}
				this.$refs.popup.close()
			}
		}
	}
</script>

<style>
</style>
